<html lang="">
<head>
    <meta charset="UTF-8">
    <title>司机监听页面模拟</title>
</head>

<body>
<h1>
    司机监听页面模拟
</h1>

<button onclick="setMessageContent('鼠标点我了')">测试message展示</button>

<div id="message">展示服务的推送过来消息的地方</br></div>

<button onclick="sourceClose()">关闭连接</button>

<script>
    userId = "1982788922184904705";
    source = null;
    identity = 2;

    if (window.EventSource) {
        console.info("此浏览器支持SSE");

        // 连接的建立
        source = new EventSource("http://localhost:8091/service-see-push/connect?userId=" + userId + "&identity=" + identity);

        // 监听服务的推送的消息
        source.addEventListener("message", function (e) {
            content = e.data;
            console.info("消息内容：" + content);

            setMessageContent(content);
        });
    } else {
        console.info("此浏览器不支持SSE");
    }

    function setMessageContent(content) {
        document.getElementById("message").innerHTML += (content + '</br>');
    }

    function sourceClose() {
        console.info("close方法执行");
        // 客户端source的关闭
        source.close();
        // 服务端map的移除
        const httpRequest = new XMLHttpRequest();
        httpRequest.open("get", "http://localhost:8091/close?userId=" + userId + "&identity=" + identity);
        httpRequest.send();
    }

</script>
</body>
</html>